<template>
  <div >
    <!--:rules="rules"-->
    <el-form :model="merchantParam"  :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">

        <el-form-item label="身份证正面" prop="reverseCardImg" >
          <el-upload
            action="http://localhost:8301/merchantPhoto/upload"
            list-type="picture-card"
            :auto-upload=true
            :show-file-list="false"
            :on-success="onSuccess1"
            name="file"
            :limit="1">
            <img v-if="merchantParam.reverseCardImg!=null" :src="merchantParam.reverseCardImg" style="width:100%;heigh:100%">
            <i class="el-icon-plus" ></i>
          </el-upload>
        </el-form-item>

        <el-form-item label="身份证反面" prop="reverseCardImg">
          <el-upload
            action="http://localhost:8301/merchantPhoto/upload"
            list-type="picture-card"
            :auto-upload=true
            :show-file-list="false"
            :on-success="onSuccess2"
            name="file"
            :limit="1">
            <img v-if="merchantParam.siteCardImg!=null" :src="merchantParam.siteCardImg" style="width:100%;heigh:100%">
            <i class="el-icon-plus" ></i>
          </el-upload>
        </el-form-item>
      <el-form-item style="text-align: center;" >
        <el-button size="medium" @click="handlePrev" style="margin-top: 50px">上一步，填写店铺基本信息</el-button>
        <el-button type="primary" size="medium" @click="handleNext" v-show="merchantParam.merchantTypeId != 1 "style="margin-top: 50px">下一步，提交营业执照</el-button>
        <el-button type="primary" size="medium" @click="handleFinishCommit" v-show="merchantParam.merchantTypeId == 1"style="margin-top: 50px" >完成,提交商品</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
  export default{
     name: "merchantIdentityDetail",
     props:{
       merchantParam: {
         type: Object
       },
       isEdit: {
         type: Boolean,
         default: false
       }
     },
    data(){
       return {
         hasEditCreated:false,
         rules: {

           reverseCardImg: [{required: true, message: '请上传身份证正面', trigger: 'blur'}],

           siteCardImg: [{required: true, message: '请上传身份证反面', trigger: 'blur'}],
         }
       }
    },
    watch: {
      merchantParam:function (newValue) {
        console.log(newValue,"--------------------身份证页")
        if(!this.isEdit)return;
        this.merchantParam=newValue
      }
    },

    methods: {
      onSuccess1(res){
        alert("-----身份证正面----")
        this.merchantParam.reverseCardImg=res;
        console.log(this.merchantParam.reverseCardImg)
        console.log(res,"**********************")
      },
      onSuccess2(res){
        alert("-----身份证反面----")
        this.merchantParam.siteCardImg=res;
      },
      handlePrev() {
        this.$emit('prevStep')
      },
      handleNext() {
        this.$emit('nextStep')
      },
      handleFinishCommit(){
        this.$emit('finishCommit',this.isEdit);
      }
    },

     /* handleRemoveProductSku(index, row) {
        let list = this.value.skuStockList;
        if (list.length === 1) {
          list.pop();
        } else {
          list.splice(index, 1);
        }
      },*/


  }
</script>
